$(function(){
    
    $("#add").on('click',function(){
        $('.addform').removeClass("nodisplay")
    })

    $(".close").on('click',function(){
        console.log(111)
        $('.addform').addClass("nodisplay")
    })


    function bindDelete(p){
        p.on("click","#delete", function(){
            if (confirm("确认要手动删除该监控对象？")){
                var item = $(this).parent().parent()
                // var id = $(this).parent().parent().attr('id')
                var host_port = $(this).parent().prev().prev().prev().html()
                console.log(host_port)
                $.ajax({
                    url: "/v1/sd/instence",  // 请求的url地址
                    type: "DELETE",
                    dataType: "json",    // 获取域服务器的数据要写 jsonp
                    data: JSON.stringify({'host_port': [host_port]}),   // 发送给服务器的数据
                    async: true,
                    traditional: true,
                    success: function(data){
                        if(data.status == 200){
                            alert(host_port + "删除成功")
                            item.remove()
                        }else{
                            alert(host_port + "删除失败")
                        }
                    },
                    error:function(error){
                        console.log(error)
                    }
                })
            }
        })
    }

    function rendertb(data){
        var tb = $("tbody")
        tb.empty()
        data.forEach((element, index, arr) => {
            sn = index + 1
            tb.append('<tr id="' + element._id.$oid + '\">' + 
                '<th scope="row">' + sn + '</th>' +
                '<td>' + element.target + '</td>' + 
                '<td>' + element.__meta_datacenter + '</td>' + 
                '<td>' + element.__meta_prometheus_job + '</td>' + 
                '<td>' + 
                '<button id="edit" type="button" class="btn btn-default .btn-sm" disabled="disabled" style="margin: 0%;padding-left: 2px;padding-right: 2px;padding-top: 0px;padding-bottom: 0px; margin-right: 2px;">编辑</button>' +
                '<button id="delete" type="button" class="btn btn-default .btn-sm"  style="margin: 0%;padding-left: 2px;padding-right: 2px;padding-top: 0px;padding-bottom: 0px;">删除</button>' +
                '</td>' + 
                '</tr>'
            )
        });
        bindDelete(tb)
    }

    function getdata(page){
        var mydata = null
        page = page ? page : 1
        $.ajax({
            url:"/v1/operator/targets?page=" + page,  // 请求的url地址
            type: "get",
            dataType:"json",    // 获取域服务器的数据要写 jsonp
            // data:{....},   // 发送给服务器的数据
            async:false,
            success:function(data){
                rendertb(data.rets)
                mydata = data
            },
            error:function(error){
                console.log(error)
            }
        })
        return mydata
    }
    var data = getdata(1)

    $(".myPagination").Pagination({
        page: 1,
        count: data.total,
        groups: 7,
        limit: 10,
        onPageChange:function (page) {
            // page 是每次点击切换页面后的页数
            getdata(page)
        }
    });
})





